import React, { Component } from "react";

export default class AsyncState extends Component {
  state = {
    count: 0,
  };
  //React有个概念，叫做batchUpdate（批量更新）
  updateState = () => {
    /* batchedUpdating = true */
    //18版本：异步的       17版本： 异步的
    this.setState({ count: 1 });
    console.log(this.state.count, "count");
    this.setState({ count: 2 });
    console.log(this.state.count, "count");
    setTimeout(()=>{
        // 18：异步       17：同步的
        this.setState({ count: 3 });
        console.log(this.state.count, "count");
        this.setState({ count: 4 });
        console.log(this.state.count, "count");
    },0)
    /* batchUpdateding = false */
    // setTimeout 的批处理，落后于外部的批处理
  };
  render() {
    return (
      <>
        <div>AsyncState1</div>
        <p>值：{this.state.count}</p>
        <button onClick={this.updateState}>修改值</button>
      </>
    );
  }
}
